<template>
  <div class="nev-breadcrumb">
    <el-breadcrumb class="location" separator="/">
      <template v-for="breadcrumb in breadcrumbs" :key="breadcrumb.name">
        <el-breadcrumb-item :to="{ path: breadcrumb.path }">
          {{ breadcrumb.name }}
        </el-breadcrumb-item>
      </template>
    </el-breadcrumb>
  </div>
</template>

<script lang="ts" setup>
import { defineProps, PropType } from 'vue';
import { IBreadCrumb } from '../types';

defineProps({
  breadcrumbs: {
    type: Array as PropType<IBreadCrumb[]>,
    default: () => []
  }
});
</script>

<style lang="less" scoped>
.nev-breadcrumb {
  color: red;
}
</style>
